<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="Access-Control-Allow-Origin" content="*"> 
		<title>角色权限修改</title>
		<link rel="stylesheet" href="css/lib/bootstrap.min.css"/>
		<link rel="stylesheet" href="js/themes/default/easyui.css"/>
		<script src="js/lib/jquery-1.11.0.js"></script>
		<script src="js/lib/bootstrap.min.js"></script>
		<script src="js/lib/vue.min.js"></script>
		<script src="js/lib/vue-resource.js"></script>
		<script src="js/base.js" type="text/javascript" charset="utf-8"></script>
		<style>
			body{
			font-size:12px;
		}
		table,
		th,
		td {
			border: 1px solid grey;
			border-collapse: collapse;
			padding: 5px;
			vertical-align: middle !important;
		}		
		table td:nth-child(odd) {
			background-color: #f1f1f1;
			width:160px;
		}
		table td:nth-child(even) {
			width:160px;
		}
		table tr:nth-child(even) {
			background-color:#ffffff;
		}
		input{
			width:280px;
		}
		span{
			width:20px;color:red;display:inline-block;text-align:center;
		}
		</style>
	</head>
	<body>
		<div class="" id="box">
			<div id="sho"></div>
		<!--查询权限-->
		<div style="padding:15px 5px 0px 5px;border:3px solid #ccc;margin-bottom:15px">
			<table class="table table-hover">				
				<tbody>
					<tr>
						<th colspan="8">用户角色修改:</th>
					</tr>
					<tr>
						<td>
							代理商ID编号：
						</td>
						<td colspan="7">
							<input id="p1" type="text" class="form-control" style="width:280px"/>
						</td>
					</tr>
					<tr>
						<td>
							角色编号：
						</td>
						<td colspan="7">
							<select name="" id="p2" class="form-control" style="width:280px">
								<option value="">请选择</option>
								<option value="1">老板</option>
								<option value="2">贴牌商</option>
								<option value="3">高级代理商</option>
								<option value="4">普通代理商</option>
								<option value="5">普通用户</option>
							</select>
						</td>
					</tr>
					<tr>
						<td colspan="8">
							<button v-on:click="add()" class="btn btn-danger" style="display:block;margin:0 auto">修改</button>
						</td>					
					</tr>
				</tbody>
			</table>		
		</div>	
		</div>		
	</body>
	<script>
		$(function(){
	new Vue({
				el:"#box",
				data:{				
				},
				methods:{
					/*修改用户角色*/
					add:function(){
						var p1 = $('#p1').val();
						var p2 = $("#p2").val();
						this.$http.post(window.baseUrl+"user/userrole/up",
						{userId:p1,roleId:p2},{emulateJSON:true}).then(
								   function (res) { 
								    console.log(res)
								    alert("修改数据成功！")
								    $('#p1').val("");
						            $("#p2").val("");						           
								   },function (res) { 
								   	alert("修改数据失败！")
								   	$('#p1').val("");
						            $("#p2").val("");						           
								   } 
								  );													
					}
				}
			})
		})
	</script>
</html>

